<!--  -->
<template>
  <div class="layui-container fly-marginTop fly-user-main">
    <ul class="layui-nav layui-nav-tree layui-inline" lay-filter="user">
      <!-- <li class="layui-nav-item">
          <a href="home.html">
            <i class="layui-icon">&#xe609;</i>
            我的主页
          </a>
        </li> -->
      <li
        class="layui-nav-item"
        v-for="(item, index) in lists"
        :key="'center' + index"
      >
        <router-link
          :to="{
            name: item.link,
          }"
          :active-class="item.activeClass"
        >
          <i class="layui-icon" :class="item.icon"></i>
          {{ item.name }}
        </router-link>
      </li>
    </ul>
    <router-view></router-view>
  </div>
</template>

<script>
import _ from 'lodash'
export default {
  name: 'center',
  data () {
    return {
      lists: [
        // {
        //   name: '我的主页',
        //   icon: 'layui-icon-heart',
        //   link: 'home',
        // },
        {
          name: '用户中心',
          icon: 'layui-icon-heart',
          link: 'center'
        },
        {
          name: '我的帖子',
          icon: 'layui-icon-heart',
          link: 'mypost',
          activeClass: 'layui-this'
        },
        {
          name: '基本设置',
          icon: 'layui-icon-heart',
          link: 'myinfo',
          activeClass: 'layui-this'
        },
        {
          name: '我的消息',
          icon: 'layui-icon-heart',
          link: 'msg'
        },
        {
          name: '其他设置',
          icon: 'layui-icon-heart',
          link: 'others'
        },
      ]
    };
  },

  components: {},

  computed: {},

  mounted () { },

  methods: {
    //    lists(){
    //     _.map(this.lists)
    //  }
  }

}

</script>
<style scoped lang='scss' >
</style>